{% extends "base_generic.html" %}

{% block content %}
  <h1 class="mb-4">图书排行榜</h1>
  
  <div class="row">
    <!-- 评分排行榜 -->
    <div class="col-md-4">
      <div class="card mb-4">
        <div class="card-header bg-primary text-white">
          <h3>评分排行榜</h3>
        </div>
        <div class="card-body p-0">
          <ul class="list-group list-group-flush">
            {% for book in top_rated %}
              <li class="list-group-item">
                <div class="d-flex justify-content-between align-items-center">
                  <div>
                    <h5 class="mb-1">
                      <span class="badge bg-secondary me-2">{{ forloop.counter }}</span>
                      <a href="{{ book.get_absolute_url }}">{{ book.title }}</a>
                    </h5>
                    <small>{{ book.author }}</small>
                  </div>
                  <div class="rating">
                    <span class="badge bg-warning text-dark">{{ book.average_rating|floatformat:1 }}</span>
                  </div>
                </div>
              </li>
            {% empty %}
              <li class="list-group-item">暂无评分数据</li>
            {% endfor %}
          </ul>
        </div>
      </div>
    </div>
    
    <!-- 借阅排行榜 -->
    <div class="col-md-4">
      <div class="card mb-4">
        <div class="card-header bg-success text-white">
          <h3>借阅排行榜</h3>
        </div>
        <div class="card-body p-0">
          <ul class="list-group list-group-flush">
            {% for book in top_borrowed %}
              <li class="list-group-item">
                <div class="d-flex justify-content-between align-items-center">
                  <div>
                    <h5 class="mb-1">
                      <span class="badge bg-secondary me-2">{{ forloop.counter }}</span>
                      <a href="{{ book.get_absolute_url }}">{{ book.title }}</a>
                    </h5>
                    <small>{{ book.author }}</small>
                  </div>
                  <div>
                    <span class="badge bg-success">{{ book.borrow_count }}次</span>
                  </div>
                </div>
              </li>
            {% empty %}
              <li class="list-group-item">暂无借阅数据</li>
            {% endfor %}
          </ul>
        </div>
      </div>
    </div>
    
    <!-- 点赞排行榜 -->
    <div class="col-md-4">
      <div class="card mb-4">
        <div class="card-header bg-danger text-white">
          <h3>点赞排行榜</h3>
        </div>
        <div class="card-body p-0">
          <ul class="list-group list-group-flush">
            {% for book in top_liked %}
              <li class="list-group-item">
                <div class="d-flex justify-content-between align-items-center">
                  <div>
                    <h5 class="mb-1">
                      <span class="badge bg-secondary me-2">{{ forloop.counter }}</span>
                      <a href="{{ book.get_absolute_url }}">{{ book.title }}</a>
                    </h5>
                    <small>{{ book.author }}</small>
                  </div>
                  <div>
                    <i class="fa fa-thumbs-up text-danger"></i> {{ book.likes }}
                  </div>
                </div>
              </li>
            {% empty %}
              <li class="list-group-item">暂无点赞数据</li>
            {% endfor %}
          </ul>
        </div>
      </div>
    </div>
  </div>
{% endblock %} 